Fix stray line in the Contributions icon - #147
Merged
Merged
Conversation
The Contributions stat used a hand-edited copy of the `package-16` octicon
that had been mangled. Its final subpath —
M2.5 13.677v-2.3L6.5 13.8v2.3Z
was a leftover sliver running to y=16.1, past the bottom of the 16x16
viewBox, so it rendered as a stray line poking out from under the cube. The
same edit had truncated the cube's right edge and dropped its bottom-right
face, and shifted the left edge to x=0.378 while the right stopped at x=15,
leaving the glyph visibly off-center.
Measured geometry before: [0.378, 0.156 -> 15.000, 16.100]
after: [1.000, 0.156 -> 15.000, 15.844]
Restore the upstream Primer `package-16` path, which is the cube this
design already intended. The icon keeps its `stack` name, so no call sites
change and nothing else about the card moves.
Artwork that escapes its viewBox gets silently clipped, which is why this
shipped unnoticed, so the new tests measure the real rendered geometry of
every icon on the card rather than eyeballing it: one asserts no icon
strays outside the box it declares, the other pins the Contributions cube
to a single path, horizontally symmetric and within bounds. Both fail
against the old path.
Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
Copilot-Session: 3a633ff9-3c7e-4499-825f-af5baab48b1c
Contributor
There was a problem hiding this comment.
Pull request overview
Restores the Contributions cube icon and adds geometry regression coverage.
Changes:
- Replaces the malformed icon path with Primer’s
package-16path. - Adds Playwright checks for viewBox bounds, centering, and overflow.
Show a summary per file
| File | Description |
|---|---|
src/components/ui/Icon.tsx |
Corrects the Contributions icon geometry. |
tests/icon-geometry.spec.ts |
Adds icon geometry regression tests. |
Review details
💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.
- Files reviewed: 2/2 changed files
- Comments generated: 0
- Review effort level: Balanced
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Follow-up to #146 — spotted on the merged download.
Symptom
The Contributions icon had a stray line hanging off the bottom-left of the cube.
Root cause
Icon.tsxcase 'stack'held a hand-edited copy of Primer'spackage-16octicon, and the edit had mangled it. The final subpath was a leftover sliver:It runs to y = 16.1, past the bottom of the
0 0 16 16viewBox — that's the stray line. The same edit also truncated the cube's right vertical edge, dropped its bottom-right face entirely, and pushed the left edge out tox = 0.378while the right stopped atx = 15, so the glyph sat visibly off-center.Rendering the shipped path next to the upstream icon makes it obvious — the middle panel is that leftover subpath on its own:
Measured geometry (viewBox is
0 0 16 16):[0.378, 0.156 → 15.000, 16.100][1.000, 0.156 → 15.000, 15.844]Fix
Restore the upstream Primer
package-16path — the cube this design already intended. One line of path data.The icon keeps its
stackkey, so the single call site inDevemonCard.tsxis untouched and nothing else on the card moves. I checked: this path was defined once and used once, so there was nothing else to update.Tests
Artwork that escapes its viewBox is silently clipped by the renderer, which is exactly why this shipped unnoticed and why eyeballing it isn't good enough.
tests/icon-geometry.spec.tsmeasures the real rendered geometry instead:card icons stay inside their viewBox— walks every<svg>the card renders, takes each path's actualgetBBox(), and fails if any of it falls outside the declared viewBox. Catches this whole class of defect, not just this one icon.contributions icon is a closed, centered cube— pins the cube to a single path, horizontally symmetric within 0.05, and not hanging below the box.Both were confirmed to fail against the old path before being committed. The first reports it precisely:
I also swept all 17 icons in
Icon.tsxfor the same defect —stackwas the only one affected, and the rest are clean.Validation
npm run check— 0 errors, 0 warningsnpm run build— cleannpx playwright test— 12/12 passing (10 existing + 2 new)Fixes: #59